﻿.load_message_notification{position:fixed;right:10px;top:100px;width:10%!important}

#lightbox .modal-content {
    display: inline-block;
    text-align: center;   
}

#lightbox .close {
    opacity: 1;
    color: rgb(255, 255, 255);
    background-color: rgb(25, 25, 25);
    padding: 5px 8px;
    border-radius: 30px;
    border: 2px solid rgb(255, 255, 255);
    position: absolute;
    top: -15px;
    right: -45px;
    z-index:1032;
}


.showcmtfacebook{padding: 0 3% 0 3%;}
#cse_nguyenmanhthang *{box-sizing:initial !important; webkit-box-sizing:initial !important;}
#cse_nguyenmanhthang .gsib_a{padding:0 0 0 5px !important;}
/*.gsc-input .gsc-input-box  .gstl_50 td.gsib_a input.gsc-input{height: 30px !important;}
td.gsc-search-button input.gsc-search-button-v2 {height: 30px !important;}
.gsc-tabsArea .gsc-tabHeader {
  height: 30px !important;
  width: 100px !important;
}*/

.fix_top_menu{top:0px;position:fixed;width:100%;z-index:100;height:0px;}
.tab_new_topic{font-size:14px;height:auto;min-height:200px;max-height:500px;padding-bottom:10px}
.list_new_topic{margin-left:-35px;}
.list_new_topic li{background-image: url(Images/new.gif);background-repeat: no-repeat;background-position: 0px center;padding-left: 35px;list-style-type: none;}
.list_hot_topic{margin-left:-35px;}
.list_hot_topic li{background-image: url(Images/hot.gif);background-repeat: no-repeat;background-position: 0px center;padding-left: 40px;list-style-type: none;}
.list_style_none{margin-left:-35px;}
.list_style_none li{list-style-type: none;}
.hr_style{border:1px solid #5bc0de;margin:0!important}
.body_style{background-color:#F5F5F5;padding-top:5px !important;}
.title_style{padding-left:10px}
.head_topic_item{background-color:#f6f6f6;height:90px;margin:10px 0px 10px 0px;}
.head_topic_list{background-color:#f6f6f6;overflow:hidden;min-height:60px;margin-top:10px;}
.font_24{font-size:24px;margin:auto!important;}
.font_22{font-size:22px;margin:auto!important;}
.font_20{font-size:20px !important;}
.h2_style a:hover{color:Black; text-decoration:none;}
.font_18{font-size:18px !important;}
.font_18_ex{font-size:18px !important;margin:auto!important;}
.font_16{font-size:16px !important;}
.font_16_ex{font-size:16px !important;margin:auto!important;}
.font_14{font-size:14px !important;}
.font_14_ex{font-size:14px !important;margin:3px;}
.font_12{font-size:12px;}
.font_12_ex{font-size:12px;margin:3px;}
.checkboxlist_style label{display:inline-block;padding-left:5px;}
.text_default{font-size: 14px;}
.a_style{display:inline-block;height:35px;width:100px;float:right;}
.img_style{height: 300px; width: auto; text-align:center;}
.container_style{margin-top:35px;margin-bottom:5px;background-color:white;}
.comment_style{border-bottom:1px dotted #747A3A;padding: 10px 5px 10px 5px;}
.comment_quantity_style{display:inline-block;height:50px;width:50px;font-size:24px;}
.page_style{overflow:hidden;}
.title_category{padding:15px 0!important;}
.tag_lable{border: 1px solid blue;font-weight:bold;}
.breadcrumb_style{margin:15px 0 5px 0;border-left:4px solid #aa6708; margin-bottom:5px !important;}
.link_color a {color: White; font-weight:bold}
.link_color span {color: Blue; font-weight:bold}
.racing_word_msg_success{color: Blue; font-weight:normal}
.racing_word_msg_error{color: Red; font-weight:bold}

.para {
	font-size: 14px;
	line-height: 1.8em;
	color: #323232;
}
.blog_left{
	display: block;
}
.blog_img{
	margin: 15px 0;
}
.blog_left h4 a{
	display: block;
	text-transform: capitalize;
	font-size: 22px;
	color: #3b3b3b;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.blog_left h4 a:hover{
	text-decoration: none;
	color: #2EB398;
}
.blog_list ul li{
	display:inline-block;
	margin-left: 10px;
}
.blog_list ul li:first-child{
	margin-left: 0;
}
.blog_list li a{
	display: block;
	padding: 4px 8px;
	color: #b6b6b6;
	text-transform: capitalize;
}
.blog_list ul li i{
	font-size: 15px;
	color: #2EB398;
}
.blog_list li span{
	padding-left:10px;
	font-size: 15px;
	color: #5a5a5a;
}
.blog_list li a:hover,.blog_list li a span:hover{
	color: #2EB398;
	text-decoration: none;
}
.b_left a{
	font-size: 14px;
	color: #323232;
}
.b_left a span{
	margin-left: 5px;
}
.b_left a:hover{
	color: #2EB398;
	text-decoration: none;	
}
.blog_right{
	margin-top: 15px;
}

/* start tag_nav */
.tag_nav {
	margin: 10px 0;
}
.tag_nav li{
	margin:10px 5px 0 0;
	display: inline-block;
}
.tag_nav li a{
	display: block;
	text-transform: capitalize;
	background: #3b3b3b;
	color: #ffffff;
	font-size: 13px;
	padding: 8px 14px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	-o-border-radius: 2px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.tag_nav li.active a,.tag_nav li a:hover{
	background: #2EB398;
	color: #ffffff;
	text-decoration:none;
}

.info_footer{color:Tomato;font-size:14px;padding-top:10px;}
.info_footer a{color:Tomato;}




.ribbon-wrapper-green {
width: 85px;
height: 88px;
overflow: hidden;
position: fixed;
top: -3px;
right: -3px;
z-index: 9999;
}

.ribbon-green {
font: bold 15px Sans-Serif;
background: orangered;
color: #ffffff;
text-align: center;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
position: relative;
padding: 7px 0;
left: -5px;
top: 15px;
width: 120px;
-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
}



.divtag{margin:5px auto auto 5px;float:left; text-decoration:none;}
.tags {padding:0; list-style:none;}
.tags li, .tags a {float:left; height:24px; line-height:24px; position:relative; font-size:12px;}
.tags a {margin-left:20px; padding:0 10px 0 12px; background:#0089e0; color:#fff; text-decoration:none; -moz-border-radius-bottomright:4px; -webkit-border-bottom-right-radius:4px; border-bottom-right-radius:4px; -moz-border-radius-topright:4px; -webkit-border-top-right-radius:4px; border-top-right-radius:4px;}
.tags a:before {content:""; float:left; position:absolute; top:0; left:-12px; width:0; height:0; border-color:transparent #0089e0 transparent transparent; border-style:solid; border-width:12px 12px 12px 0;}
.tags a:after {content:""; position:absolute; top:10px; left:0; float:left; width:4px; height:4px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; background:#fff; -moz-box-shadow:-1px -1px 2px #004977; -webkit-box-shadow:-1px -1px 2px #004977; box-shadow:-1px -1px 2px #004977;}
.tags a:hover {background:khaki; text-decoration:none;}
.tags a:hover:before {border-color:transparent khaki transparent transparent;}


#news-container
{
	width: 700px; 
	margin: auto;
	color: Orange;
	font-size: 14px;
}
#news-container a
{
    color: Orange;
}




















a {
    color:#004175;
    text-decoration:none;
	text-transform:none;
}
a:hover {
    /*color:#4f82ac;*/
    text-decoration:underline;
}


h1, h2, h3, h4, h5, h6 {
    padding: 0px;
    margin: 0px;
}

.contact_left h3{
	font-size: 24px;
	color: #004175;
	text-transform: capitalize;
}
.contact_left p{
	font-size: 14px;
	color: #999999;
	line-height: 1.5em;
}
.contact_left input[type="text"],.contact_left textarea{
	margin:20px 0;
	box-shadow: none;
	border: 1px solid #303030;
	background:#C0E6ED;
	color: Blue;
	line-height:1.8em;
	display: block;
	width: 100%;
	padding: 6px 12px;
	font-size: 16px;
	outline:none;
	-webkit-appearance:none;
	transition: border-color 0.3s;
	-o-transition: border-color 0.3s;
	-ms-transition: border-color 0.3s;
	-moz-transition: border-color 0.3s;
	-webkit-transition: border-color 0.3s;
}
.contact_left textarea{
	resize: none;
	height: 160px;
}
.contact_left input[type="text"]:focus,.contact_left textarea:focus{
	border: 1px solid #2EB398;	
}
.contact_left input[type="text"]:hover,.contact_left textarea:hover{
	border-color: #2EB398;
}
.address li{
	display: block;
	margin: 10px  0;
}
.address li i{
	color:#2EB398;
	font-size: 20px;
	vertical-align: middle;
}
.address{
	margin-top: 20px;
}
.address li span{
	color: #004175;
	font-size: 14px;
	margin-left: 15px;
}
.address li a{
	color: #004175;
	font-size: 14px;
	margin-left: 8px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.address li a:hover{
	text-decoration:none;
	color:#2EB398;
}
.contact_left input[type="submit"] {
	-webkit-appearance: none;
	cursor: pointer;
	outline: none;
	background: #2EB398;
	text-transform: uppercase;
	font-weight: 100;
	border: none;
	color: Black;
	padding: 14px 24px;
	font-size: 13px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.contact_left input[type="submit"]:hover{
	background: #2B9C85;
}











/****** Gridview Setting ****/
.mGrid {width: 100%; background-color: #fff; margin: 5px 0 10px 0; border: solid 1px #525252; border-collapse:collapse; }
.mGrid td {padding: 2px; border: solid 1px #c1c1c1; color: #717171; }
.mGrid th {padding: 4px 2px; color: #fff; background: #686868 repeat-x top; border-left: solid 1px #525252; font-size: 0.9em; }
.mGrid .GridHeader a {color:#CC9966; text-decoration:none; font-weight:normal}
.mGrid .GridFooter {}

.styleGrid th{text-align: center; vertical-align:middle !important;}
.styleGrid .GridItemNumber {text-align: right}
.styleGrid .GridItemText {text-align: left}
.styleGrid .GridItemLink a {text-align: center; color: Blue; text-decoration:none}
.styleGrid .GridItemDate {text-align: center}
.styleGrid .GridItemCode {text-align: center}

.styleGrid .GridAlternatingItem{background-color: #F9F9F9;height: 20px;}
.styleGrid .numberpagestyle td{padding: 5px 10px 5px 10px; border: 1px solid #c1c1c1; font-weight:bold;}
.styleGrid .headerpagestyle th{text-align: center;}
.title_input{width: 150px!important;}
.input_number{text-align: right;}
.notnull{color:Red;}
.label_warning{color:Orange; font-size:13px;}

.talkbubble {
   background: #EFF4F2;
   position: relative;
   -moz-border-radius:    10px;
   -webkit-border-radius: 10px;
   border-radius:         10px;
   min-height:60px;
}
.talkbubble:before {
   content:"";
   position: absolute;
   right: 100%;
   top: 26px;
   width: 0;
   height: 0;
   border-top: 13px solid transparent;
   border-right: 26px solid #EFF4F2;
   border-bottom: 13px solid transparent;
}
.margin_checkbox label
{
    margin-left: 5px;
}


#top-link-block.affix-top {
    position: absolute; /* allows it to "slide" up into view */
    bottom: -82px; /* negative of the offset - height of link element */
    right: 10px; /* padding from the left side of the window */
}
#top-link-block.affix {
    position: fixed; /* keeps it on the bottom once in view */
    bottom: 80px; /* height of link element */
    right: 10px; /* padding from the left side of the window */
    border-radius: 25px;
}
.back-to-top{
  padding: 15px 17px !important;
  border-radius: 25px !important;
  }






/*===========================================================================================================================
  Icons
 ================= */

/* footer social icons */
ul.social-network{list-style:none;display:inline;margin-left:0 !important;padding:0;}
ul.social-network li{display:inline;margin:0 5px;}
/* footer social icons */
.social-network a.icoRss:hover{background-color: #F56505;}
.social-network a.icoFacebook:hover{background-color:#3B5998;}
.social-network a.icoTwitter:hover{background-color:#33ccff;}
.social-network a.icoGoogle:hover{background-color:#BD3518;}
.social-network a.icoVimeo:hover{background-color:#0590B8;}
.social-network a.icoLinkedin:hover{background-color:#007bb7;}
.social-network a.icoRss:hover i, .social-network a.icoFacebook:hover i, .social-network a.icoTwitter:hover i,
.social-network a.icoGoogle:hover i, .social-network a.icoVimeo:hover i, .social-network a.icoLinkedin:hover i{color:#fff;}
.social-networka.socialIcon:hover, .socialHoverClass {color:#44BCDD;}
.social-circle li a {display:inline-block;position:relative;margin:0 auto 0 auto;-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%;text-align:center;width: 50px;height: 50px;font-size:20px;}
.social-circle li i {margin:0;line-height:50px;text-align: center;}
.social-circle li a:hover i,.triggeredHover{-moz-transform: rotate(360deg);-webkit-transform: rotate(360deg);-ms--transform: rotate(360deg);transform: rotate(360deg);-webkit-transition: all 0.2s;-moz-transition: all 0.2s;-o-transition: all 0.2s;-ms-transition: all 0.2s;transition: all 0.2s;}
.social-circle i {color: #fff;-webkit-transition: all 0.8s;-moz-transition: all 0.8s;-o-transition: all 0.8s;-ms-transition: all 0.8s;transition: all 0.8s;}
.social-circle a {background-color: #D3D3D3;}
/*=========================================================================================================================== */



/*===================================================Grid/List======================================================================== */
.thumbnail
{
    margin-bottom: 20px;
    padding: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

.item.list-group-item
{
    float: none;
    width: 100%;
    background-color: #fff;
    margin-bottom: 10px;
}
.item.list-group-item:nth-of-type(odd):hover,.item.list-group-item:hover
{
    background: #428bca;
}

.item.list-group-item .list-group-image
{
    margin-right: 10px;
}
.item.list-group-item .thumbnail
{
    margin-bottom: 0px;
}
.item.list-group-item .caption
{
    padding: 9px 9px 0px 9px;
}
.item.list-group-item:nth-of-type(odd)
{
    background: #eeeeee;
}

.item.list-group-item:before, .item.list-group-item:after
{
    display: table;
    content: " ";
}

.item.list-group-item img
{
    float: left;
}
.item.list-group-item:after
{
    clear: both;
}
.list-group-item-text
{
    margin: 0 0 11px;
}
/*=========================================================================================================================== */

.grid_list
{
    box-shadow:0 1px 7px rgba(0,0,0,.14);
    border: 1px solid #ddd;
    margin-top:15px;
    padding:5px;
    background:url("http://cdn.wpfreeware.com/wp-content/themes/wpfreeware/images/border-color-small.png") repeat-x scroll center top White
}
.grid_list h3{color:#00a9eb!important}
.tab_margin{margin-top:15px}
.item_padding{padding-right:10px}
.btn-glyphicon{padding:3px;background:#ffffff;margin-right:4px;font-size:9px}
.icon-btn{padding:1px 15px 3px 2px !important;border-radius:50px !important;}
.div_keyworks{height:250px;overflow-y:scroll;}
.div_keyworks p{margin:0 0 2px !important;}
.dockbar{border:2px solid #e3e3e3;padding:5px;background-image:linear-gradient(to bottom,#e8e8e8 0,#f5f5f5 100%)}




/*=========================================================================== BEGIN TREE ================================================ */
.tree, .tree ul {
    margin:0;
    padding:0;cursor:pointer;
    list-style:none
}
.tree ul {
    margin-left:1em;
    position:relative
}
.tree ul ul {
    margin-left:.5em
}
.tree ul:before {
    content:"";
    display:block;
    width:0;
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    border-left:1px solid
}
.tree li {
    margin:0;
    padding:0 1em;
    line-height:2em;
    color:#369;
    /*font-weight:700;*/
    position:relative
}
.tree ul li:before {
    content:"";
    display:block;
    width:10px;
    height:0;
    border-top:1px solid;
    margin-top:-1px;
    position:absolute;
    top:1em;
    left:0
}
.tree ul li:last-child:before {
    background:#fff;
    height:auto;
    top:1em;
    bottom:0
}
.indicator {
    margin-right:5px;
}
.tree li a {
    text-decoration: none;
    color:#369;
}
.tree li button, .tree li button:active, .tree li button:focus {
    text-decoration: none;
    color:#369;
    border:none;
    background:transparent;
    margin:0px 0px 0px 0px;
    padding:0px 0px 0px 0px;
    outline: 0;
}
/*=========================================================================== END TREE ================================================ */

.am_lich
{
    position: fixed;
    top: 60px;
    right: 11px;
    z-index: 100000;
}




/* ==================================================*/
.checkbox {
  padding-left: 20px; }
  .checkbox label {
    display: inline-block;
    position: relative;
    padding-left: 5px; }
    .checkbox label::before {
      content: "";
      display: inline-block;
      position: absolute;
      width: 17px;
      height: 17px;
      left: 0;
      margin-left: -20px;
      border: 1px solid #cccccc;
      border-radius: 3px;
      background-color: #fff;
      -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
      -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
      transition: border 0.15s ease-in-out, color 0.15s ease-in-out; }
    .checkbox label::after {
      display: inline-block;
      position: absolute;
      width: 16px;
      height: 16px;
      left: 0;
      top: 0;
      margin-left: -20px;
      padding-left: 3px;
      padding-top: 1px;
      font-size: 11px;
      color: #555555; }
  .checkbox input[type="checkbox"] {
    opacity: 0; }
    .checkbox input[type="checkbox"]:focus + label::before {
      outline: thin dotted;
      outline: 5px auto -webkit-focus-ring-color;
      outline-offset: -2px; }
    .checkbox input[type="checkbox"]:checked + label::after {
      font-family: 'FontAwesome';
      content: "\f00c"; }
    .checkbox input[type="checkbox"]:disabled + label {
      opacity: 0.65; }
      .checkbox input[type="checkbox"]:disabled + label::before {
        background-color: #eeeeee;
        cursor: not-allowed; }
  .checkbox.checkbox-circle label::before {
    border-radius: 50%; }
  .checkbox.checkbox-inline {
    margin-top: 0; }

.checkbox-primary input[type="checkbox"]:checked + label::before {
  background-color: #428bca;
  border-color: #428bca; }
.checkbox-primary input[type="checkbox"]:checked + label::after {
  color: #fff; }

.checkbox-danger input[type="checkbox"]:checked + label::before {
  background-color: #d9534f;
  border-color: #d9534f; }
.checkbox-danger input[type="checkbox"]:checked + label::after {
  color: #fff; }

.checkbox-info input[type="checkbox"]:checked + label::before {
  background-color: #5bc0de;
  border-color: #5bc0de; }
.checkbox-info input[type="checkbox"]:checked + label::after {
  color: #fff; }

.checkbox-warning input[type="checkbox"]:checked + label::before {
  background-color: #f0ad4e;
  border-color: #f0ad4e; }
.checkbox-warning input[type="checkbox"]:checked + label::after {
  color: #fff; }

.checkbox-success input[type="checkbox"]:checked + label::before {
  background-color: #5cb85c;
  border-color: #5cb85c; }
.checkbox-success input[type="checkbox"]:checked + label::after {
  color: #fff; }

.radio {
  padding-left: 20px; }
  .radio label {
    display: inline-block;
    position: relative;
    padding-left: 5px; }
    .radio label::before {
      content: "";
      display: inline-block;
      position: absolute;
      width: 17px;
      height: 17px;
      left: 0;
      margin-left: -20px;
      border: 1px solid #cccccc;
      border-radius: 50%;
      background-color: #fff;
      -webkit-transition: border 0.15s ease-in-out;
      -o-transition: border 0.15s ease-in-out;
      transition: border 0.15s ease-in-out; }
    .radio label::after {
      display: inline-block;
      position: absolute;
      content: " ";
      width: 11px;
      height: 11px;
      left: 3px;
      top: 3px;
      margin-left: -20px;
      border-radius: 50%;
      background-color: #555555;
      -webkit-transform: scale(0, 0);
      -ms-transform: scale(0, 0);
      -o-transform: scale(0, 0);
      transform: scale(0, 0);
      -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
      -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
      -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
      transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); }
  .radio input[type="radio"] {
    opacity: 0; }
    .radio input[type="radio"]:focus + label::before {
      outline: thin dotted;
      outline: 5px auto -webkit-focus-ring-color;
      outline-offset: -2px; }
    .radio input[type="radio"]:checked + label::after {
      -webkit-transform: scale(1, 1);
      -ms-transform: scale(1, 1);
      -o-transform: scale(1, 1);
      transform: scale(1, 1); }
    .radio input[type="radio"]:disabled + label {
      opacity: 0.65; }
      .radio input[type="radio"]:disabled + label::before {
        cursor: not-allowed; }
  .radio.radio-inline {
    margin-top: 0; }

.radio-primary input[type="radio"] + label::after {
  background-color: #428bca; }
.radio-primary input[type="radio"]:checked + label::before {
  border-color: #428bca; }
.radio-primary input[type="radio"]:checked + label::after {
  background-color: #428bca; }

.radio-danger input[type="radio"] + label::after {
  background-color: #d9534f; }
.radio-danger input[type="radio"]:checked + label::before {
  border-color: #d9534f; }
.radio-danger input[type="radio"]:checked + label::after {
  background-color: #d9534f; }

.radio-info input[type="radio"] + label::after {
  background-color: #5bc0de; }
.radio-info input[type="radio"]:checked + label::before {
  border-color: #5bc0de; }
.radio-info input[type="radio"]:checked + label::after {
  background-color: #5bc0de; }

.radio-warning input[type="radio"] + label::after {
  background-color: #f0ad4e; }
.radio-warning input[type="radio"]:checked + label::before {
  border-color: #f0ad4e; }
.radio-warning input[type="radio"]:checked + label::after {
  background-color: #f0ad4e; }

.radio-success input[type="radio"] + label::after {
  background-color: #5cb85c; }
.radio-success input[type="radio"]:checked + label::before {
  border-color: #5cb85c; }
.radio-success input[type="radio"]:checked + label::after {
  background-color: #5cb85c; }
  
  
  /* ==================================================*/
  .cmn-toggle {
  position: absolute;
  margin-left: -9999px;
  visibility: hidden;
}
.cmn-toggle + label {
  position: relative;
  cursor: pointer;
  outline: none;
  user-select: none;
}


  input.cmn-toggle-round + label {
  padding: 2px;
  width: 53px;
  height: 25px;
  background-color: #dddddd;
  border-radius: 60px;
}
input.cmn-toggle-round + label:before,
input.cmn-toggle-round + label:after {
  display: block;
  position: absolute;
  top: 1px;
  left: 1px;
  bottom: 1px;
  content: "";
}
input.cmn-toggle-round + label:before {
  right: 1px;
  background-color: #f1f1f1;
  border-radius: 60px;
  transition: background 0.4s;
}
input.cmn-toggle-round + label:after {
  width: 22px;
  background-color: #fff;
  border-radius: 100%;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
  transition: margin 0.4s;
}
input.cmn-toggle-round:checked + label:before {
  background-color: #8ce196;
}
input.cmn-toggle-round:checked + label:after {
  margin-left: 30px;
}
/* ==================================================*/